<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
			<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<style type="text/css">
			.swiper-container {
				width: 100%;
				height: 100%;
				left: 0;
				top: 0;
				background-color: black;
			}
		</style>
		<link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css" />
		
	</head>

	<body>
		<!--轮播图-->
		<div class="swiper-container ">
			<div class="swiper-wrapper">
				<div class="swiper-slide"><img src="images/pagefour/p1.png" id="img1" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p2.png" id="img2" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p3.png" id="img3" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p4.png" id="img4" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p5.png" id="img5" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p6.png" id="img6" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p7.png" id="img7" /></div>
				<div class="swiper-slide"><img src="images/pagefour/p8.png" id="img" /></div>

			</div>

			<!-- 如果需要导航按钮 -->
			<div class="swiper-button-prev"></div>
			<div class="swiper-button-next"></div>

		</div>

	</body>
	<script src="js/swiper-3.4.2.min.js" type="text/javascript" charset="utf-8"></script>
	<script>
		var mySwiper = new Swiper('.swiper-container', {
			loop: true,
			// 如果需要前进后退按钮
			nextButton: '.swiper-button-next',
			prevButton: '.swiper-button-prev'
		})
	</script>

</html>